<template>
  <view v-if="data.trade">
    <up-cell-group v-if="data.delivery.delivery.value == 1">
      <up-cell title="提货方式" :value="`${data.delivery.delivery.text}-${data.delivery.name}`"></up-cell>
      <up-cell title="收货地址">
        <template #value>
          <view style="flex: 1; text-align: right;">{{ data.delivery.address }}</view>
        </template>
      </up-cell>
      <up-cell title="提货地址" label-width="100px">
        <template #value>
          <view style="flex: 1; text-align: right;">{{ data.delivery.deliveryInfo.description }}</view>
        </template>
      </up-cell>
      <up-cell title="收货电话" :value="data.delivery.phone"></up-cell>
    </up-cell-group>
    <up-cell-group v-if="data.delivery.delivery.value == 0">
      <up-cell title="提货方式" :value="`${data.delivery.delivery.text}-${data.delivery.store.name}`"></up-cell>
      <up-cell title="预约提货时间" :value="$filter.dateFormat(data.delivery.takeAwayBook.bookTime)"></up-cell>
      <up-cell title="提货电话" :value="data.delivery.takeAwayBook.phone"></up-cell>
      <up-cell title="仓库地址" :value="data.delivery.store.address"></up-cell>
      <up-cell title="仓库电话" :value="data.delivery.store.phone"></up-cell>
    </up-cell-group>

    <view class="u-border-top">
      <view
        class="u-p-l-20 u-p-r-20 u-p-b-30 u-p-t-30 u-border-bottom"
        v-for="(item, index) in data.goods" :key="index"
      >
        <goods-item
          type="horizontal"
          :data="item"
          size="84px"
        ></goods-item>
      </view>
    </view>

    <view class="p-10" style="line-height: 3;">
      <view class="flex-block" style="justify-content: space-between;">
        <view class="u-tips-color">商品数量:</view>
        <view>{{ data.trade.quantity }}</view>
      </view>
      <view class="flex-block" style="justify-content: space-between;">
        <view class="u-tips-color">运费:</view>
        <view>¥{{ data.delivery.deliveryPrice }}</view>
      </view>
    </view>

    
    <up-cell-group>
      <up-cell title="支付方式">
        <template #value>
          <up-text :text="data.trade.payType.text" :color="$u.color.success" align="right" />
        </template>
      </up-cell>
      <up-cell title="余额支付额" :value="'￥' + data.trade.coin"></up-cell>
      <up-cell title="现金支付额" :value="'￥' + data.trade.cash"></up-cell>
      <up-cell title="共计">
        <template #value>
          <up-text :text="'￥' + data.trade.totalPrice" :color="$u.color.warning" align="right" />
        </template>
      </up-cell>
      <up-cell title="最终确认价格" v-if="data.trade.finalPrice || data.trade.finalPrice === 0">
        <template #value>
          <up-text :text="'￥' + data.trade.finalPrice" :color="$u.color.warning" align="right" />
        </template>
      </up-cell>
      <up-cell title="交易完成时间" :value="data.trade.finishedTime"></up-cell>
    </up-cell-group>
  </view>
</template>

<script>
export default {
  props: ['data', 'tradeId'],
  data() {
    return {
      formData: {}
    }
  },
  computed: {
    payCash() {
      if (!this.data.trade.totalPrice) return 0
      return this.data.trade.totalPrice - this.formData.coin;
    }
  }
}
</script>

<style lang="scss" scoped>

</style>